<template>
  <q-input outlined  v-bind="$attrs" v-on="$listeners"
           :type="type"  :value="value" @input="input" :placeholder="placeholder"  dense>
    <template v-slot:before>
      <div class="f_title text-justify">
        <span class="star">*</span>
        <span class="txt">{{text}}</span>：
      </div>
    </template>
  </q-input>
</template>

<script>
export default {
  name: 'inputItem',
  props: {
    value: {
      type: [Number, String, Array],
    },
    inputName: {
      type: String,
      default: '',
    },
    placeholder: {
      type: String,
      default: '',
    },
    text: {
      type: String,
      default: '',
    },
    type: {
      type: String,
      default: 'text',
    },
  },
  methods: {
    input($event) {
      console.log($event.target.value);
      this.$emit('input', $event.target.value);
    },
  },
};
</script>

<style lang="scss" scoped>
.f_title{
  font-size: 16px;
.txt{
  width: 65px;
  display: inline-block;
  text-align-last: justify;
}
.star{
  color: red;
}
}
</style>
